<template>


  <div>

    <!--  查询-->
    <el-card>

      <el-form inline label-width="90px" size="mini" class="demo-form-inline">


        <el-form-item label="文件名称">
          <el-input placeholder="请输入文件名称" v-model.trim="queryParam.filename" clearable size="mini"></el-input>
        </el-form-item>
        <el-form-item label="原始文件名">
          <el-input placeholder="请输入原始文件名" v-model.trim="queryParam.originalFilename" clearable size="mini"></el-input>
        </el-form-item>
        <el-form-item label="文件扩展名">
          <el-input placeholder="请输入文件扩展名" v-model.trim="queryParam.ext" clearable size="mini"></el-input>
        </el-form-item>
        <el-form-item label="MIME类型">
          <el-input placeholder="请输入MIME类型" v-model.trim="queryParam.contentType" clearable size="mini"></el-input>
        </el-form-item>
        <el-form-item label="对象类型">
          <el-select v-model="queryParam.objectType" placeholder="请选择" clearable  >
            <el-option key="1" label="组件图标" value="1"/>
            <el-option key="2" label="场所图标" value="2"/>
            <el-option key="3" label="第三方头像" value="3"/>
            <el-option key="4" label="用户头像" value="4"/>
            <el-option key="5" label="现场存储文件" value="5"/>
            <el-option key="6" label="计算机的登录认证文档" value="6"/>
            <el-option key="7" label="组件版本文档相关的图片" value="7"/>
            <el-option key="8" label="应用的图标" value="8"/>
            <el-option key="9" label="应用安装文档图片" value="9"/>
            <el-option key="10" label="产品图标" value="10"/>
            <el-option key="11" label="环境访问信息文档图片" value="11"/>
            <el-option key="12" label="部署开始和启动文档图片" value="12"/>
            <el-option key="13" label="部署过程文档图片" value="13"/>
            <el-option key="14" label="部署验证文档图片" value="14"/>
            <el-option key="15" label="工具图标" value="15"/>
            <el-option key="16" label="工具安装的文档图片" value="16"/>
            <el-option key="17" label="工具部署开始和启动" value="17"/>
            <el-option key="18" label="工具部署过程" value="18"/>
            <el-option key="19" label="工具部署验证" value="19"/>
            <el-option key="20" label="厂商用户头像" value="20"/>
            <el-option key="21" label="产品问题解决方案" value="21"/>
            <el-option key="22" label="产品问题详情" value="22"/>
            <el-option key="23" label="知识库文档" value="23"/>
            <el-option key="24" label="干系人头像" value="24"/>
          </el-select>
        </el-form-item>
        <el-form-item label="上传状态">
          <el-select v-model="queryParam.uploadStatus" placeholder="请选择" clearable  >
            <el-option key="0" label="临时文件" :value="0"/>
            <el-option key="1" label="生产" :value="1"/>
            <el-option key="2" label="生产[已删除]" :value="2"/>
          </el-select>
        </el-form-item>


        <el-form-item>
          <el-button type="success" size="mini" @click="getListPage">查询</el-button>
          <el-button type="info" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>

      </el-form>

    </el-card>





    <!--列表-->
    <el-card style="margin-top: 10px">

      <el-table
          :data="tableData"
          max-height="580px"
          height="580px"
          style="width: 100%">


        <el-table-column prop="originalFilename" label="原始文件名"/>

        <el-table-column prop="sizeCh" label="文件大小"/>
        <el-table-column prop="userName" label="隶属用户"/>

        <el-table-column prop="ext" label="文件扩展名"/>
        <el-table-column prop="tempFile" label="是否临时文件">
          <template slot-scope="scope">
            <el-tag type="danger" size="mini" v-if="scope.row.tempFile === 0">临时文件</el-tag>
            <el-tag type="success" size="mini" v-else-if="scope.row.tempFile === 1">生产</el-tag>
            <el-tag type="info" size="mini" v-else-if="scope.row.tempFile === 2">生产[删除]</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="delTime" label="删除文件时间"/>



        <el-table-column fixed="right" label="操作" width="60">
          <template slot-scope="scope">
            <el-button @click="openViewBefore(scope.row)" type="text" size="small"><i class="el-icon-view"></i>查看</el-button>
          </template>
        </el-table-column>

      </el-table>


      <!--分页部分-->
      <el-pagination
          style="width:33%; margin-right:10px; margin-top:10px;"
          background
          layout="total, prev, pager, next, jumper"
          @current-change="pageCurrentChange"
          :page-size="pageConfig.size"
          :current-page="pageConfig.current"
          :pager-count="5"
          :total="pageConfig.total">
      </el-pagination>

    </el-card>

    <OpsDromaraFileStorageDetailed ref="OpsDromaraFileStorageDetailedRef"/>

  </div>

</template>


<script>

import http from '@/utils/http'
import OpsDromaraFileStorageDetailed from './OpsDromaraFileStorageDetailed.vue'


export default {
  name: "OpsDromaraFileStorageList",
  components: {
    OpsDromaraFileStorageDetailed,
  },
  data() {
    return {
      // 查询参数
      queryParam: {
        id: null,
        url: null,
        size: null,
        userId: null,
        tempFile: null,
        delTime: null,
        filename: null,
        originalFilename: null,
        basePath: null,
        path: null,
        ext: null,
        contentType: null,
        platform: null,
        thUrl: null,
        thFilename: null,
        thSize: null,
        thContentType: null,
        objectId: null,
        objectType: null,
        metadata: null,
        userMetadata: null,
        thMetadata: null,
        thUserMetadata: null,
        attr: null,
        fileAcl: null,
        thFileAcl: null,
        hashInfo: null,
        uploadId: null,
        uploadStatus: null,
        createTime: null,
      },
      // 分页参数
      pageConfig: {
        // 每页记录数
        size: 20,
        // 当前页码
        current: 1,
        // 总记录数
        total: 0,
      },
      // 表格数据
      tableData: [],
    }
  },
  methods: {
    /**
     * 查看之前触发
     * @param obj 这一行数据
     */
    openViewBefore(obj){
      this.$refs.OpsDromaraFileStorageDetailedRef.init(obj)
    },
    /**
     * 删除之前的提示框
     * @param obj 要删除的数据
     */
    delTips(obj) {
      this.$confirm('是否执行删除, 删除后无法恢复，是否继续?', '提示', {
        confirmButtonText: '确定删除',
        cancelButtonText: '取消删除',
        type: 'warning'
      }).then(() => {
        // 确定删除
        this.delOpsDromaraFileStorage(obj)

      }).catch(() => {
        // 取消删除
      });
    },
    /**
     * 删除
     * @param obj 要删除的数据
     */
    delOpsDromaraFileStorage(obj) {
      http.post("opsDromaraFileStorage/delOpsDromaraFileStorage", {
        id: obj.id,
      }).then(response => {
        let res = response.data;
        this.getListPage()
        this.$message.success("删除成功");

      }).catch(error => {
        this.$message.error (error.message)
      })
    },
    /**
     * 分支分页查询列表
     */
    getListPage() {
      this.queryParam.current = this.pageConfig.current
      this.queryParam.size = this.pageConfig.size
      http.post("/fileStorage/getPage", this.queryParam).then(response => {
        let res = response.data;
        // 分页数据
        let data = res.data;
        this.pageConfig.total = data.total;
        this.pageConfig.current = data.current;
        this.pageConfig.size = data.size;
        // 表格数据
        this.tableData = data.records

      }).catch(error => {
        this.$message.error (error.message);
      })
    },
    /**
     * 分页被改变的时候
     * @param value 当前页
     */
    pageCurrentChange(value) {
      this.pageConfig.current = value
      this.getListPage()
    },
     /**
     * 重置查询条件
     */
    resetQuery() {
      this.queryParam = {
        id: null,
        url: null,
        size: null,
        userId: null,
        tempFile: null,
        delTime: null,
        filename: null,
        originalFilename: null,
        basePath: null,
        path: null,
        ext: null,
        contentType: null,
        platform: null,
        thUrl: null,
        thFilename: null,
        thSize: null,
        thContentType: null,
        objectId: null,
        objectType: null,
        metadata: null,
        userMetadata: null,
        thMetadata: null,
        thUserMetadata: null,
        attr: null,
        fileAcl: null,
        thFileAcl: null,
        hashInfo: null,
        uploadId: null,
        uploadStatus: null,
        createTime: null,
      }
    },
     /**
     * 分页前重置分页参数
     */
    getPageListBefore() {
      this.pageConfig.current = 1
      this.getListPage()
    },
  },
  // 进入马上执行
  mounted() {
    this.getListPage()
    this.$store.commit ('navigationListChange', [
      {name: '统一文件存储记录', url: '/toOpsDromaraFileStorageList', query: {}},
    ])
  },
}
</script>

<style scoped>

</style>

